<template>
  <div>
    <!-- <h1>{{msg}}</h1>
    <h2>{{obj.name}}</h2>
    <h3>{{obj.age>18? '成年':'未成年'}}</h3> -->

    <!-- <p>你要买的商品数量:{{ count }}</p>
    <button v-on:click="addFn">增加一个</button>
    <button v-on:click="addCountFn(5)">一次+五个</button> -->

    <!-- <div> -->
    <!-- <p>{{ word }}</p>
    <button @click="jokeBtnFn">点击说笑话</button> -->
    <!-- </div> -->
    <p>你要买商品的数量: {{ count }}</p>
    <button v-on:click="addFn">增加1个</button>
    <button v-on:click="addCountFn(5)">一次加5件</button>

    <button @click="subFn">减少</button>
  </div>
</template>

<script>
// export default {
//   data() {
//     return {
//       word: "这里是一条笑话",
//       jokeArr: [
//         "我去相亲网站去了, 那你找到对象了吗? 不! 我找到了他们网站的一个Bug",
//         "讲述一下车怎么翻沟里了。我坐在副驾说沟！沟!沟! 朋友说：欧嘞，欧嘞。欧嘞 结果车就翻里了。",
//         "几位大哥开车去钓鱼，车陷草里了，然后几个大神说把草烧了就出来了，然后就放火烧了，结果就烧没了。",
//       ],
//     };
//   },
//   methods: {
//     jokeBtnFn() {
//       let randNum = Math.floor(Math.random() * this.jokeArr.length);
//       let str = this.jokeArr[randNum];
//       this.word = str;
//     },
//   },
// };
export default {
  // ...其他省略
  methods: {
    addFn() {
      // this代表export default后面的组件对象(下属有data里return出来的属性)
      this.count++;
    },
    addCountFn(num) {
      this.count += num;
    },
    subFn() {
      this.count--;
    },
  },
};
</script>

<style>
</style>
